<template>
  <el-config-provider :locale="currentLocale">
    <router-view />
    <ReDialog />
  </el-config-provider>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import { ElConfigProvider } from "element-plus";
import zhCn from "element-plus/lib/locale/lang/zh-cn";
import en from "element-plus/lib/locale/lang/en";
import { ReDialog } from "@/components/ReDialog";
import { handleKeyPress } from "@/utils/hotKeyManager";
import { onMounted, onBeforeUnmount } from "vue";

export default defineComponent({
  name: "app",
  components: {
    [ElConfigProvider.name]: ElConfigProvider,
    ReDialog
  },
  computed: {
    currentLocale() {
      return this.$storage.locale?.locale === "en" ? en : zhCn;
    }
  },
  setup() {
    const handleKeyPressEvent = event => handleKeyPress(event);

    onMounted(() => {
      window.addEventListener("keydown", handleKeyPressEvent);
    });

    onBeforeUnmount(() => {
      window.removeEventListener("keydown", handleKeyPressEvent);
    });
    return {};
  },

  created() { }
});
</script>
